import React, { useEffect } from 'react'
import { Form, Input, DatePicker } from "antd";
import { useDispatch, useSelector } from "umi";
import DropPopover from "@/components/DropPopover";
import zhCn from "antd/lib/locale/zh_CN"

export default function index({ reload }) {
    const [form] = Form.useForm();
    const { isClearForm } = useSelector(state => state.common)
    const dispatch = useDispatch();
    // 没次isClearForm进行判断内容，看是否进行刷新
    useEffect(() => {
        if (isClearForm) {
            form.resetFields();
            reload({});
            dispatch({
                type: "common/setIsClearForm",
                payload: false
            })
        }
    }, [isClearForm]);
    // 提交新的值
    const onChangeDate = (date) => {
        // 修改传过去的参数
        const queryObje = {
            findByYear: new Date(new Date(date).getFullYear(), 0, 1).getTime()
        };
        form.getFieldValue('staffName') && (queryObje.staffName = form.getFieldValue('staffName'));
        reload(queryObje)
    }

    // 当选中人员时做的事情
    const searchVal = (item) => {
        form.setFieldsValue({
            staffNameVal: item.userName,
            staffName: item._id
        });
        reload({ staffName: item._id })
    }

    return (
        <Form layout='vertical' form={form}>
            <Form.Item label="考核员工" name="staffNameVal">
                <Input
                    readOnly
                    placeholder="请输入搜索的员工"
                    addonAfter={
                        <DropPopover
                            placeValue="请输查询的员工"
                            interfaced="getStaffLists"
                            searchType="userName"
                            getnewValue={(item) => searchVal(item)}
                        />
                    }
                />
            </Form.Item>
            <Form.Item name="staffName" style={{ display: "none" }}>
                <Input></Input>
            </Form.Item>
            <Form.Item label="考核年份" name="findByYear">
                <DatePicker
                    onChange={onChangeDate}
                    placeholder='请选择年份'
                    picker="year"
                    locale={zhCn.DatePicker}>
                </DatePicker>
            </Form.Item>
        </Form>)
}
